<template>
  <h1>属性绑定指令</h1>
  <input type="text" value="vv">
  <input type="text" value="info">
  <!-- 将input元素的value属性与info变量的值进行绑定，由info变量来控制输入框要显示的默认值 -->
  <input type="text" v-bind:value="info">
  <!-- :value是v-bind:value的简写-->
  <input type="text" :value="info">
  <hr>
  <!--  此处的url是一个响应式变量，使用url来控制超链接跳转的位置
      ：href=“url”与v-bind：href=“url”的写法是等价的-->
  <a href="url">超链接</a>
  <a :href="url">超链接2</a>

</template>

<script setup>
  import {ref} from "vue";

  const info = ref("属性绑定666");
  const url = ref("https://www.baidu.com");
  url.value= "https://www.jd.com";
  url.value= "https://doc.codeboy.com";
</script>


<style scoped>

</style>